<template>
    <div class="TransferOut">
        <div class="container">
            <div class="f-column f-j-around f-a-center">
                <strong class="amount DIN-Medium">1989000000.1234</strong>
                <span class="title">可转出数量</span>
                <span class="message">此ADS来源于伞下收益的10%沉淀</span>
            </div>
        </div>
        <div class="container f-column f-j-around f-a-center" style="height: 4.4rem;">
            <input type="text" v-model="transferOutAmount" placeholder="请输入转出数量">
            <div></div>
            <div class="submitButton">转出</div>
            <div></div>
        </div>
    </div>
</template>

<script lang="ts">
import { Component, Vue } from 'vue-property-decorator'
import {NAV_BAR_INFO} from "@/store/MutationTypes";
@Component({
    name: 'TransferOut'
})
export default class extends Vue {
    private transferOutAmount: number | null = null;
    private mounted(): void {
        this.$common.scrollToTop();
        let __this = this;
        this.$store.dispatch(NAV_BAR_INFO, {
            leftItem: {name: '钱包', click: () => {
                    __this.$router.push('/wallet');
                }},
        })
    }
}
</script>

<style scoped lang="less">
.TransferOut {
    padding: 0.2rem 0.3rem;
    & .container {
        background-color: white;
        padding: 0.2rem;
        margin-bottom: 0.2rem;
        & .amount {
            color: #666666;
            font-size: 0.54rem;
            line-height: 1.0rem;
            margin-top: 0.6rem;
        }
        & .title {
            color: #A6A6A6;
            font-size: 0.24rem;
            line-height: 0.8rem;
            margin-bottom: 0.6rem;
        }
        & .message {
            color: #A6A6A6;
            font-size: 0.24rem;
            line-height: 0.6rem;
        }
        & input {
            border: none;
            border-radius: 0.1rem;
            text-align: center;
            padding: 0.3rem;
            font-size: 0.3rem;
            background:rgba(250,250,247,1);
            width: 6.3rem;
        }
    }
}
</style>
